<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <title> - FooTable</title>
    <meta name="keywords" content="">
    <meta name="description" content="">

    <link rel="shortcut icon" href="favicon.ico"> 
    <link href="css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="css/font-awesome.css?v=4.4.0" rel="stylesheet">
    <link href="css/plugins/footable/footable.core.css" rel="stylesheet">

    <link href="css/animate.css" rel="stylesheet">
    <link href="css/style.css?v=4.1.0" rel="stylesheet">
     <!--alert css-->
    <link rel="stylesheet" type="text/css" href="css/sweetalert.css"/>
    <link href="css/plugins/footable/footable.core.css" rel="stylesheet">
	<link href="css/plugins/summernote/summernote.css" rel="stylesheet">
    <!--分页css-->
    <link rel="stylesheet" href="css/page.css" />
    <!-- 全局js -->
    <script src="js/jquery.min.js?v=2.1.4"></script>
    <script src="js/bootstrap.min.js?v=3.3.6"></script>
    <script src="js/plugins/footable/footable.all.min.js"></script>
    <!-- 分页js -->
	<script type="text/javascript" src="js/jquery.page.js"></script>
	<!--alert提示款-->
    <script type="text/javascript" src="js/sweetalert.min.js"></script>
    <!-- 自定义js -->
    <script src="js/content.js?v=1.0.0"></script>
    <script src="js/core.js"></script> 
    <script src="js/pay_order.js"></script>
    
	<script src="js/plugins/summernote/summernote.min.js"></script>
	<script src="js/plugins/summernote/summernote-zh-CN.js"></script>
	<script src="js/demo/summernote-demo.js"></script>
    
</head>

<body class="gray-bg">

    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
        <form class="form form-inline search-form-items" method="get" action="">
        	<style>
					.form-inline .form-group {
						margin-right: 12px;
						margin-bottom: 15px;
					}
					
					.form-inline .btn {
						margin-bottom: 15px;
					}
					
					.form-group .right {
						display: inline-block;
					}
					
					@media (max-width: 768px) {
						.form-group .left {
							width: 25%;
						}
						.form-group .right {
							width: 70%;
						}
						.search-form-items .search-btn {
							width: 100%;
						}
					}
				</style>
				
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>订单列表</h5>
                    </div>
                    <div class="form-group item_create_time " style="padding-top: 10px;">
								<label class="left control-label"> <span>应还款时间：</span> </label>
								<div class="right">
									<div class="input-group">
										<div class="input-group-addon"><i class="fa fa-calendar"></i></div>
										<input type="text" id="applyTime" name="applyTime" class="form-control input dateranger" value="" placeholder="应还款时间">
									</div>
									<link rel="stylesheet" href="lingyun/daterangepicker.css">
									<script src="lingyun/moment.min.js"></script>
									<script src="lingyun/daterangepicker.js"></script>
									<script type="text/javascript">
										$(function() {
											// 初始化日期范围插件
											$('#applyTime').daterangepicker({
												"showDropdowns": true,
												"autoApply": false,
												// "dateLimit": {
												//     "days": 365 * 100
												// },
												"linkedCalendars": false,
												"opens": 'right',
												"ranges": {
													"一周内": [
														moment().subtract(6, 'days'),
														moment()
													],
													"一月内": [
														moment().subtract(29, 'days'),
														moment()
													],
													"本月内": [
														moment().startOf('month'),
														moment().endOf('month')
													],
													"上个月": [
														moment().subtract(1, 'month').startOf('month'),
														moment().subtract(1, 'month').endOf('month')
													]
												},
												autoUpdateInput: false,
												locale: {
													format: 'YYYY-MM-DD',
													separator: ' - ',
													applyLabel: '确定',
													cancelLabel: '取消',
													fromLabel: '从',
													toLabel: '到',
													customRangeLabel: '日期范围',
													daysOfWeek: ['日', '一', '二', '三', '四', '五', '六'],
													monthNames: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
													firstDay: 1
												},
												"minDate": "YYYY-MM-DD",
												"maxDate": "YYYY-MM-DD"
											}, function(start, end, label) {
												console.log("New date range selected: " + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD') + " (predefined range: " + label + ")");
											});

											$('#applyTime').on('apply.daterangepicker', function(ev, picker) {
												$(this).val(picker.startDate.format('YYYY-MM-DD') + '~' + picker.endDate.format('YYYY-MM-DD'));
											});

											$('#applyTime').on('cancel.daterangepicker', function(ev, picker) {
												$(this).val('');
											});
										})
									</script>
								</div>

								<!--<div class="input-group search-form" ">
									<span class="input-group-btn" style="padding-top: 7px;"><a class="btn btn-default search-btn" href="#applyTime" onclick="searchList();"><i class="fa fa-search"></i></a></span>
								</div>-->
							</div>	
						<div class="form-group item_status " style="padding-top: 10px; >
								<label class="left control-label"> <span>订单状态：</span> </label>
								<div class="right">
									<select  id="status" name="auth_status" class="form-control lyui-select select" style="font-size: 13px">
										<option value=''>全部：</option>
										<option value="待付租">待付租</option>
										<!--<option value="已付租">已付租</option>-->
										<option value="已欠租">已欠租</option>
										<!--<option value="已完结">已完结</option>-->
									</select>
								</div>
							</div>
						
							<div class="input-group search-form">
								<input type="text"  id="param"   class="search-input form-control"  placeholder="电话">
								<span class="input-group-btn">
									<button type="button" id="toSearch" class="btn btn-sm btn-primary" style="margin-left:20px ;" onclick="searchList()"> 搜索</button>
								</span>
							</div>
						<div class="input-group " style="padding-top: 12px; padding-left: 20px;">
							<button type="button" id="toSearch" class="btn btn-sm btn-primary" style="margin-left:20px ;" onclick="excal()">导出</button>
						</div>
					 </form>
				 	<div class="col-sm-0">
                        <div class="input-group">
                          	  人数：
                            <span id="thiscount"></span>
                        </div>
                    </div>
                </div>
                        <table class="table table-stripped toggle-arrow-tiny" data-page-size="8">
                            <thead>
                                <tr>
                                	<th>姓名</th>
                                	<th>电话</th>  
                                	<th>订单编码</th>
                                	<th>回租价格(元)</th>
                                	<th>保证金(元)</th>
                                	<th>保证金状态</th>
                                    <th>日租金(元)</th>
                                    <th>借款天数(天)</th>
                                    <th>欠租金额(元)</th>
                                    <th>欠租天数(天)</th>
                                    <th>超时费用(元)</th>
                                    <th>合计应还金额(元)</th>
                                    <th>应还时间</th>
                                    <th>订单状态</th>
                                    <th>催收员</th>
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody id="thislist">
                            </tbody>
                            
                            <tbody>
								<tr>
									<td colspan="8">
										<div id="pager"></div>
									</td>
								</tr>
							</tbody>
                        </table>

                    </div>
                </div>
            </div>
        </div>
    </div>


	<!-- 催款备注-弹窗 -->
		<div class="modal inmodal" id="update" tabindex="-1" role="dialog" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content animated bounceInRight">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">&times;</span>
                        <span class="sr-only">关闭</span>
                    </button>
						<h4 class="modal-title" id="this_title1">催款记录</h4>
					</div>
					<div class="modal-body">
						<div class="form-group">
							<label>记录详情</label>
							<div class="form-group">
								<div class="summernote" id="remark"></div>
							</div>

						</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
						<button id="orderId" type="button" class="btn btn-primary" data-dismiss="modal" onclick="updateRemark(this.name)">提交</button>
					</div>
				</div>
			</div>
		</div>
	<!--线下激租-弹窗 -->
<!--		<div class="modal inmodal" id="payorder" tabindex="-1" role="dialog" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content animated bounceInRight">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">&times;</span>
                        <span class="sr-only">关闭</span>
                    </button>
						<h4 class="modal-title" >线下激租</h4>
					</div>
					<div class="modal-body">
						<label></label>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
						<button  type="button" class="btn btn-primary" data-dismiss="modal" onclick="updateRemark(this.name)">提交</button>
					</div>
				</div>
			</div>
		</div>-->


</body>
</html>

